<template>
  <el-collapse-item class="collapse" :name="name">
    <template v-slot:title>
      <div class="block"></div>
      <span class="collapse-title">{{ title }}</span>
    </template>
    <slot></slot>
  </el-collapse-item>
</template>

<script setup name="CollapseItem">
const props = defineProps({
  title: {
    type: String,
    default: ''
  },

  name: {
    type: String,
    default: ''
  }
})
</script>

<style scoped>
.collapse-title {
  font-weight: 600;
}
.block {
  width: 3px;
  display: inline-block;
  height: 16px;
  background-color: rgb(62, 146, 255);
  margin-right: 8px;
}
</style>
